<%@ page language="java" import="java.util.*,com.beans.*,com.dao.*" pageEncoding="UTF-8"%>   
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%
String path = request.getContextPath();  
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">  
<html>
  <head>
    <base href="<%=basePath%>">  
    
    <title>My JSP 'index.jsp' starting page</title>
	<meta http-equiv="pragma" content="no-cache">
	<meta http-equiv="cache-control" content="no-cache">
	<meta http-equiv="expires" content="0">    
	<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
	
	<meta http-equiv="description" content="This is my page">
	<script type="text/javascript" src="js/jquery-1.8.0.js"></script> 
	<script type="text/javascript">
		$(function(){
			/* 用于菜单联动 */
			$("#one").change(function(){
				$("#two").empty();
				var Pid=this.value;
				if(Pid=="-1"){
					$("#two").append("<option value='-1'>请选择二级分类</option>");
				}else{
					$("#two").append("<option value='-1'>请选择二级分类</option>");
					$.ajax({
						url:"GoodsServlet.do",
						type:"post",
						data:{flag:"lianDong",id:Pid},
						dataType:"json",
						success:function(goods){
							var smallId = '${smallCateId}';
							$.each(goods,function(k,v){
								if(smallId==v.id){
									var str="<option value='" + v.id+"' selected='selected'>" + v.cateName + "</option>";
								}else{
									var str="<option value='" + v.id+"'>" + v.cateName + "</option>";
								}
								$("#two").append(str);
							});
							$("#two_msg").html("√").removeClass().addClass("validate_ok");
						}
					});
				}
			});
			$("#ch_checkall,#top_ch_checkall").click(function(){
				if(this.checked){
					$("input[name=ck_id]").attr("checked","checked");
				}else{
					$("input[name=ck_id]").removeAttr("checked");
				}		
			});
					
			$("table tr").mouseover(function(){
				$(this).css("background","#D3EAEF");
				$(this).siblings().css("background","white");
			});
			$("#one").change();  //在数据回显时候用与菜单联动
			
			
			
		});
		
		function bianYe(pageIndex,flag){
			document.form1.action="GoodsServlet.do?&pageIndex=" + pageIndex + "&flag=" + flag;
			document.form1.submit();
		}
		
		function zhuanYe(flag){
			var pageIndex=document.getElementById("pageIndex").value;
			bianYe(pageIndex,flag);
		}
		
		
		function deletemore(pageIndex){
			var list=document.getElementsByName("ck_id");
			var flag=false;
			for(var i=0;i<list.length;i++){
				if(list[i].checked==true){
					flag=true;
				}
			}
			if(flag==true){
				if(confirm("确定要删除吗")){
					var href=$()
					document.form1.action="GoodsServlet.do?flag=moredelete&pageIndex=" + pageIndex;
					document.form1.submit();
					return false;/* 让form表单提交进行多个删除   超链接不提交  如果超链接也提交就回提交两次 */
				}else{
					return false;
				}
				
			}else{
				alert("至少选中一个才可以删除");
				return false;
			}
		}
		function getElemPos(obj) {
			var pos = {
				"top" : 0,
				"left" : 0
			};
			if (obj.offsetParent) {
				while (obj.offsetParent) {
					pos.top += obj.offsetTop;
					pos.left += obj.offsetLeft;
					obj = obj.offsetParent;
				}
			} else if (obj.x) {
				pos.left += obj.x;
			} else if (obj.x) {
				pos.top += obj.y;
			}
			
			return {
				x : pos.left,
				y : pos.top
			};
		}
		function outP(){
			$("#div_goods_detail").hide();
		}
		
		function showP(item,id,des){
			var position = getElemPos(item);
			$("#div_goods_detail").show();
			$("#div_goods_detail").css("left", position.x - 150).css("top",
					position.y);
			$("#goods_picture").attr("src","GoodsServlet.do?flag=showPicture&goodsId="+id);
			$("#div_imgdesc").html("<center>" + des + "</center>");
		}
		</script>
		
		<link rel="stylesheet" type="text/css" href="css/maintable.css" ></link>
		<style type="text/css">
			#adminName{
				width:150px;/* 来设定用户账号那一栏固定长度 */
			}
			
			#div_goods_detail{
	    		display:none;
	    		position: absolute;
	    	}
		</style>
		
  </head>
  
  <body>
    <div class ="div_title">
		<div class="div_titlename"> <img src="images/san_jiao.gif" ><span>商品列表</span></div>
		<div class="div_titleoper">
			<input type="checkbox" id="top_ch_checkall"/> 全选 <a href="goods/goods_add.jsp"> <img src="images/add.gif"/>添加 </a> <a href="GoodsServlet.do?flag=moredelete" onclick="return deletemore('${pageInfo.pageIndex}')"><img src="images/del.gif"/>删除</a> </div>
		</div>
		<%
		  	GoodsDao goodsDao = new GoodsDao();
		  	List<CateInfo> cateInfo = goodsDao.getCateList(0);
		  	request.setAttribute("cateInfo", cateInfo);
	 	 %>
		<form action="GoodsServlet.do"  name="form1" method="post">
		<select name="bigCate" id="one">
			<option value="-1">请选择一级分类</option>
			<c:forEach var="cate" items="${cateInfo }">
			 	<option value="${ cate.id}" <c:if test="${param.bigCate==cate.id }">selected</c:if> >${cate.cateName }</option>
			</c:forEach>
		</select>
		<select name="smallCate" id="two">
			<option value="-1">请选择二级分类</option>
		</select>
		商品名称: <input type="text" name="shangpin" value="${shangpin }"/>
		<input type="hidden" name="flag" value="fenzu">
		<input type="submit" value="查询" onclick="return confirm('确认查询吗')">
		 <table class="main_table" >
		       <tr>
		 				<th><input type="checkbox" id="ch_checkall" /></th>	<th id="adminName">名称</th> 	<th>单位</th>	<th>单价</th>  <th>大分类</th>  <th>小分类</th> 	<th>操作</th>
		 		</tr>
		 		<c:forEach var="goods" items="${ goodsList}">
		 			<tr>
		 				<td><input type="checkbox" name="ck_id" value="${ goods.id}" /> </td>
		 				<td id="goodsName" >${goods.goodsName }</td>
		 				<td>
		 					${goods.unit }
		 				</td>
		 				<td >${goods.price }</td>
		 				<td >${goods.bigCateName }</td>
		 				<td >${goods.smallCateName }</td>
		 				<td>
			 				<a href="javascript:void(0)" onmouseover="showP(this,'${goods.id}','${goods.des }')"
			 				onmouseout="outP()"
			 				>查看</a> |  
			 				<a href="GoodsServlet.do?flag=goodsGoUpdate&id=${goods.id}" onclick="return confirm('确认要修改吗')">修改</a> |  	
		 			    	<a href="GoodsServlet.do?flag=deletegoods&id=${goods.id}&pageIndex=${pageInfo.pageIndex }" onclick="return confirm('确认要删除吗')">删除</a> |  
			 			</td>
		 			</tr>
		 		</c:forEach>
		</table>
		</form>
		
		<div class="div_page" >
			  <div class="div_page_left">    共有 <label>${pageInfo.rowCount }</label> 条记录，当前第 <label>${pageInfo.pageIndex }</label> 页，共 <label>${pageInfo.pageCount }</label> 页	</div>		
			  <div class="div_page_right" > 	 
			  		<c:choose>
				  		<c:when test="${pageInfo.hasPre }">
				  			<input type="submit" value="首页" onclick="bianYe(1,'${flag }')"/>
				  			<input type="submit" value="上一页" onclick="bianYe(${pageInfo.pageIndex-1 },'${flag }')"/>
				  			
				  		</c:when>
				  		<c:otherwise>
				  			首页  上一页
				  		</c:otherwise>
				  	</c:choose>
				  	<c:choose>
				  		<c:when test="${pageInfo.hasNext }">
				  			<input type="submit" value="下一页" onclick="bianYe(${pageInfo.pageIndex+1 },'${flag }')"/>
				  			<input type="submit" value="尾页" onclick="bianYe(${pageInfo.pageCount },'${flag }')"/>
				  		</c:when>
				  		<c:otherwise>
				  			下一页 尾页
				  		</c:otherwise>
				  	</c:choose>
					<input type="submit" value="转到" onclick="zhuanYe('${flag}')">
			  		<input type="text" name="pageIndex" id="pageIndex" name="pageIndex" value="${pageInfo.pageIndex }" /> 页
			  	
			   </div>
		</div>
		<div id="div_goods_detail">
			<img id="goods_picture" width="140" height="190" />
			<div id="div_imgdesc"></div>
		</div>
		<script >
			var t="${adminManage}";
			if(t!=""){
				alert(t);
			}
		</script>
  </body>
</html>